<template>
	<view>
		<tt-bar leftIcon="icon-back" title="老带新福利详情" bgColor="#fed407" titleAlign="left" :isShare="isShare">
			<template v-slot:rightCnt>
				<text class="iconfont icon-shoucangdianjia" :style="{'background-color':goodData.isDelete?'#ffffff':btnBg}" @tap="toshop"></text>
				<!-- <text class="iconfont icon-home rIcon" :style="{'background-color':goodData.isDelete?'#ffffff':btnBg}" @tap="toHome"></text> -->
			</template>
		</tt-bar>
		<view class="content">
			<view class="shopimgbox">
				<image :src="storeLogo" mode=""></image>
			</view>
			<view class="imgbox">
				<image :src="'http://cdn.peixun.de123.com'+oldinfo.img" mode=""></image>
			</view>
			<view class="oldnewbox">
				<view class="oldnewbox1" style="font-size: 30rpx;color: red;font-weight: 700;margin-top: 30rpx;margin-bottom: 10rpx;">
					<text>老带新福利</text>
				</view>
				<view class="oldnewbox2" style="font-size: 24rpx;color:#4e4e4e;">
					<text>{{oldinfo.oldAndNewWelfare}}</text>
				</view>
			</view>
			
		</view>
		<view class="oldnewbtn">
			<button class="oldnewbtn1" @tap="showPoster">
				<text>分享到朋友圈</text>
			</button>
			<button open-type="share" class="oldnewbtn2">
				<text>送给好友</text>
			</button>
			<!-- <button  class="oldnewbtn2" @tap="add">
				<text>送给好友</text>
			</button> -->
		</view>
		<qrcode-poster ref="poster" :title="name.substr(0,12)" :headerImg="'http://cdn.peixun.de123.com'+oldinfo.img"></qrcode-poster>
	</view>
</template>

<script>
	import QrcodePoster from '../components/zhangyu-qrcode-poster/zhangyu-qrcode-poster.vue';
	import {
		mapState,
		mapGetters,
		mapMutation,
		mapActions
	} from "vuex";
	export default {
		
		computed: {
			...mapState({
				userInfo: state => state.user.userInfo,
				isLogin: state => state.user.isLogin,
				initInfo: state => state.sys.initInfo,
				parentId: state => state.user.parentId
				
			})
		},
		components: {
			QrcodePoster
		},
		data() {
			return {
				storeId:0,
				oldinfo:{},
				name:'',
				actOldAndNewId:0,
				cid:0,
				storeLogo:'',
				isShare:0
			}
		},
		methods: {
			toshop(){
				
			
				this.toPage(
				{
					url:'shopDetail',
					id:this.storeId
				}
				
				)
			},
			apiyesoldxiangqing () {
				this.$store
					.dispatch('apiyesoldxiangqing', {
						storeId:this.storeId,
						userId: this.userInfo.userId
					})
					.then(res => {
						console.log(res)
						this.oldinfo = res.data.oldAndNewWelfarePage
						this.name = res.data.oldAndNewWelfarePage.activityOldAndNew.actName
						this.actOldAndNewId = res.data.oldAndNewWelfarePage.activityOldAndNew.id
						this.cid = res.data.oldAndNewWelfarePage.id
						this.storeLogo = res.data.oldAndNewWelfarePage.storeLogo
						console.log(this.actOldAndNewId)
					});
			},
			tongji(){
				this.$store
					.dispatch('apioldsharetongji', {
						storeId:this.storeId						
					})
					.then(res => {
						
						
					});
			},
			// apioldnewstudent(){
			// 	this.$store
			// 		.dispatch('apioldnewstudent', {
			// 			storeId:this.storeId,
			// 			giverId:105,
			// 			actOldAndNewId:11,
			// 			userId:this.userInfo.userId,
			// 			oldCardId:2
			// 		})
			// 		.then(res => {
			// 			console.log(res);
			// 			var storeId = this.storeId
			// 			uni.showToast({
			// 				title: res.data.msg,
			// 				icon:  'none',							
			// 				success: function() {
			// 					if(res.data.code==0){
			// 						uni.navigateTo({
			// 							url:"../../pagesB/oldnewxiangxiangqing/oldnewxiangxiangqing?storeId=" + storeId
			// 						})
			// 					}																			
			// 				}
			// 			});
			// 		});
			// },
			showPoster(){
				
				uni.showLoading({
				    title: '加载中...',
					mask: true
				})				
				let _href='';
				_href=this.oldinfo.storeId+'&'+this.userInfo.userId + '&'+this.cid+ '&' +this.actOldAndNewId
				// if(this.isLogin){
				// 	_href='url=oldfulifriend&id='+this.oldinfo.storeId+'&uid='+this.userInfo.userId ; 
				// }else{
				// 	_href='url=oldfulifriend&id='+this.oldinfo.storeId + '&cid=' + this.cid + '&actOldAndNewId=' +this.actOldAndNewId;
				// }
				this.$store.dispatch("apiGetMPToken").then(res=>{
					console.log(res.data.data.access_token)
					this.$store.dispatch("apiGetMpCodeImg",{
						token:res.data.data.access_token,
						page:'pages/index/index',
						scene:_href,
						width:280
					}).then(imgRes=>{
						this.tongji()
						console.log(res)
						if(imgRes.data.code==1){
							this.$refs.poster.showCanvas(imgRes.data.data)
						}else{
							
						}
						
					})
				})
			},
			// add(){
			// 	uni.navigateTo({
			// 		url:"../../pagesB/oldfulifriend/oldfulifriend?storeId=" + this.storeId+ '&userId=' + this.userInfo.userId+ '&cid=' + this.cid + '&actOldAndNewId=' + this.actOldAndNewId
			// 	})
			// }
			
		},
		//页面分享
		onShareAppMessage(res) {
		       this.tongji()			 
			return {
				title: '“送你一个优惠福利，快来领取吧！” ' + this.oldinfo.activityOldAndNew.actName,
				path: 'pagesB/oldfulifriend/oldfulifriend?storeId=' + this.storeId + '&userId=' + this.userInfo.userId+ '&cid=' + this.cid + '&actOldAndNewId=' + this.actOldAndNewId + '&isShare=1',
				imageUrl: 'http://cdn.peixun.de123.com'+this.oldinfo.img
				
			};	
		},
		onLoad(data) {
			this.storeId = data.storeId;
			this.apiyesoldxiangqing();
			// this.apioldnewstudent()
		}
	}
</script>

<style lang="less">
	body{
		background-color: #f2f2f2;
	}
.content{
	padding: 0;
	width: 100%;
	height: 100%;
	background-color: #f2f2f2;
	margin-bottom: 150rpx;
	position: relative;
	// background-color: pink;
	.shopimgbox{
		position: absolute;
		top: 60rpx;
		left: 60rpx;
		text-align: center;
		image{
			border-radius: 7rpx;
			width: 150rpx;
			height: 150rpx;
			
		}
	}
	.imgbox{
		width: 100%;
		height: 1332rpx;
		// padding: 0 20rpx;
		// background-color: green;
		image{
			width: 100%;
			height: 100%;
		}
	}
	.oldnewbox{
		// background-color: red;
		width: 100%;
		// height: 190rpx;
	}
	
}
.oldnewbtn{
		// background-color: blue;
		width: 100%;
		height: 150rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		padding: 0 40rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		.oldnewbtn1{
			width: 320rpx;
			height: 100rpx;
			border-radius: 50rpx;
			background-color: #07c160;
			text-align: center;
			line-height: 100rpx;
			font-size: 30rpx;
			color: #fff;
			
		}
		.oldnewbtn2{
			background-color: #f59423;
			width: 320rpx;
			height: 100rpx;
			border-radius: 50rpx;
			text-align: center;
			line-height: 100rpx;
			font-size: 30rpx;
			color: #fff;
		}
	}
	.icon-shoucangdianjia {
		font-size: 44upx;
		font-weight: normal;
		width: 70upx;
		height: 70upx;
		text-align: center;
		line-height: 70upx;
		border-radius: 50%;
	}
</style>
